<template>
  <!--案件导入-批次确认-->
  <section class="component case-batch-confirm">
    <el-form label-width="100px" :model="comfirmModel" :rules="rules" ref="form">
      <el-form-item label="批次号：" prop="batchNumber">
        <el-select placeholder="请选择" v-model="comfirmModel.batchNumber" @change="changeShopping">
          <el-option v-for="item in batchList" :key="item.batchNumber" :label="item.batchNumber"
                     :value="item.batchNumber">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="确认状况：" v-if="comfirmModel.batchNumber" prop="comfirmModel">
        <el-steps :active="comfirmModel.steplength" space="150px">
          <el-step title="产品信息确认"></el-step>
          <el-step title="客户信息确认"></el-step>
          <el-step title="案件信息确认"></el-step>
        </el-steps>
      </el-form-item>
    </el-form>
    <div class="operate-buttons">
      <el-button @click="emitClose">取消</el-button>
      <el-button @click="chooseBatchNumberConfirm">确定</el-button>
    </div>
    <el-dialog title="批次确认" width="800px" :visible.sync="dialog" :show-close="false" :close-on-click-modal="false"
               :close-on-press-escape="false" append-to-body>
      <check-confirm @close="dialog=false,emitClose()" @success="success1" :messageData="checkData"
                     :batchNumber='comfirmModel.batchNumber'></check-confirm>
    </el-dialog>
  </section>
</template>

<script lang="ts">
    import Vue from 'vue';
    import {Component, Emit, Prop} from 'vue-property-decorator';
    import {Dependencies} from '~/core/decorator';
    import {CaseInfoService} from '~/services/domain-service/case-info.service';
    import {Form} from "element-ui";
    import {CaseInfoConfirmService} from "~/services/dataimp-service/case-info-confirm.service";
    import CheckConfirm from "./check-confirm.vue";


    @Component({
        components: {
            CheckConfirm,
        }
    })
    export default class CaseBatchConfirm extends Vue {
        @Dependencies(CaseInfoService) private caseInfoService: CaseInfoService;
        @Dependencies(CaseInfoConfirmService) private caseInfoConfirmService: CaseInfoConfirmService;

        @Prop()
        private batchList: any[]

        private contractNumberList:any[];

        private comfirmModel: any = {
            batchNumber: '',
            steplength: 0
        };
        private checkData: any = {};
        private dialog: any = false;

        private rules = {
            batchNumber: {required: true, message: "请选择批次号！"}
        }

        @Emit("success")
        private emitSuccess() {
            this.$message.success('案件信息确认后台正在进行,请前往待分配案件查看');
            this.emitClose()
        }

        @Emit("close")
        private emitClose() {
            const form = this.$refs.form as Form;
            form.resetFields()
        }

        /**
         * 选择批次号
         */
        private chooseBatchNumberConfirm() {
            const form = this.$refs.form as Form;
            form.validate(v => {
                if (!v) return
                this.caseConfirm();
            })
        }

        private changeShopping(val) {
            const currentNumber: any = this.batchList.filter((x) => x.batchNumber === val)[0]
            if (currentNumber.productFlag === "YES" && currentNumber.personalFlag === "YES" && currentNumber.caseFlag === "YES") {
                this.comfirmModel.steplength = 3
            } else if (currentNumber.personalFlag === "YES" && currentNumber.productFlag === "YES") {
                this.comfirmModel.steplength = 2
            } else if (currentNumber.productFlag === "YES") {
                this.comfirmModel.steplength = 1
            } else {
                this.comfirmModel.steplength = 0
            }
        }

        /**
         * 案件确认选择批次号确认
         */
        private caseConfirm() {
            const {steplength: flag, batchNumber} = this.comfirmModel
            if (flag === 0) {
                this.caseInfoConfirmService.confirmProductInfo({batchNumber}).subscribe(
                    (data) => {
                        this.$message.success('产品信息确认成功')
                        this.comfirmModel.steplength = 1
                    }
                )
            } else if (flag === 1) {
                this.caseInfoConfirmService.confirmPersonalInfo({batchNumber}).subscribe(
                    (data) => {
                        this.$message.success('客户信息确认成功')
                        this.comfirmModel.steplength = 2
                    }
                )
            } else if (flag === 2) {
                const ss: any = {
                    batchNumber: this.comfirmModel.batchNumber
                }
                this.caseInfoConfirmService.confirmCaseInfo(ss).subscribe(data => {
                    if (data.messageModels !== null) {
                        this.checkData = data
                        this.dialog = true
                    } else {
                        this.emitSuccess()
                    }
                })
            }
        }

        private success1() {

            this.checkData.messageModels.forEach((val,idx,array)=>{
                this.contractNumberList = [...val.contractNumberList]
            });
            const ss: any = {
                batchNumber: this.comfirmModel.batchNumber,
                contractNumberList: this.contractNumberList,
                status: this.checkData.status
            }
            this.caseInfoConfirmService.confirmCaseInfo(ss).subscribe(data => {
                this.dialog = false
                this.emitSuccess()

            })
        }
    }
</script>

<style lang="less">
  .page.case-batch-confirm {
    .el-step__title.is-finish {
      font-size: 12px;
    }

    .el-step__title.is-process {
      font-size: 12px;
    }

    .el-step__title.is-wait {
      font-size: 12px;
    }

    .el-input.el-input--suffix {
      margin-left: 30px;
    }
  }
</style>
